<template>
    <!-- 页面级别共用的 -->
    <!-- 课程列表 -->
    <AppPageTopInfo title="我的课程" subTitle="subTitle">

    </AppPageTopInfo>

    <AppPageContent :cols="3" :opApi="courseApi">
        <template v-slot="{ item }">
            <div class="box p-2">
                <div class="">
                    <AppImg :src="item.cover" style="border-radius: 5px;"></AppImg>
                </div>

                <h5 class="text-lg fw-bold mb-2 mt-4 chover">
                    <router-link :to="'/admin/custom-detail?id=' + item.id">
                        {{ item.title }}
                    </router-link>
                </h5>
                <p class="text-sm">{{ item.intro }}</p>
                <div class="flex justify-between items-center mt-2 mb-4">
                    <div>
                        <!-- {{ item }} -->
                    </div>
                    <button class="btn-enter" @click="$router.push('/course-detail?id=' + item.id)">进入课程</button>
                </div>

            </div>
        </template>
    </AppPageContent>

</template>
<script setup>
import courseApi from "@/api/courseApi"
</script>
